	<template>
		<view class="content">
			<u-navbar title="全部订单" :placeholder="true" :safeAreaInsetTop="true" leftIcon=" "></u-navbar>
			 <u-tabs :list="list1"
			  :current="number"
			  lineColor="#025E21"
			  :activeStyle="{
				  color:'#2ab55d'
			  }"
			  lineWidth="28"
			  @change="tabswitch"
			  ></u-tabs>
			  <!-- 空状态 -->
			  <view class="kong" v-if="orderList.length === 0">
			  	<u-empty
			  			icon="https://xixijj.oss-cn-chengdu.aliyuncs.com/attach/2023/09/3e9a9202309221201265442.png"
			  			width="70%"
			  	>
			  	</u-empty>
			  </view>
			  <scroll-view v-else scroll-y="true" class="scroll-Y" lower-threshold="20" @scrolltolower='renew'>
				<OrderIntel :orderList="orderList" @payobj="orderapi"></OrderIntel>
				<u-loadmore :status="status" />
			  </scroll-view>
			  <FooterNavigation></FooterNavigation>
		</view>
	</template>
	
	<script>
		import orderintel from '@/components/oderintel/orderintel.vue'
		import {getorderlist} from '@/api/commodity.js'
		export default{
			data(){
				return{
					status:'loadmore',
					count:null,
					number:0,
					order:{
						page:1,
						limit:10
					},
					list1:[
						{name:"全部",state:''},
						{name:"待支付",state:'10'},
						{name:"待发货",state:'20'},
						{name:"待收货",state:'30'},
						{name:"退款/售后",state:'50'},
						{name:"已完成",state:'40'}
					],
					orderList:[]
				}
			},
			methods:{
				leftClick(){
					uni.switchTab({
						url:'/pages/my/my'
					})
				},
				tabswitch(el){
						this.order.page = 1
						this.order.state = el.state
						this.orderapi()
				},
				async orderapi(){
					const {data} = await getorderlist(this.order)
					this.orderList = data.data
					this.count = data.count
					this.count>this.orderList.length?this.status='loadmore':this.status='nomore'
				},
				async renew(){
					if(this.count>this.orderList.length){
						this.order.page++
						this.status = 'loading'
						const {data} = await getorderlist(this.order)
						this.orderList.push(...data.data)
						this.status = 'loadmore'
					}else{
						this.status = 'nomore'
					}
				}
			},
			components:{
				OrderIntel:orderintel
			},
			onLoad(el) {
				if(el.state || el.number){
					this.number = el.num
					this.order.state = el.state
				}
				this.orderapi()
			}
		}
	
	</script>
	
	<style lang="scss">
		page{
			background-color: #fafafa;
		}
		.content{
			padding: 0rpx 40rpx 0rpx 40rpx;
		}
		.scroll-Y{
			height:84vh;
			.empty{
				color: #999;
				font-size: 28rpx;
				text-align: center;
				margin-top: 60rpx;
			}
		}
	</style>
